﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>JS Bin</title>

</head>
<body>
    <div class="container">
        <div class="row clearfix">
            <div class="col-sm-12" align="center">
                <h1>{{frontgreeting}}</h1>
               
                <form ng-submit="seedObject()">
                    <input ng-model="newName" placeholder="Sale Item Name" />
                    <input ng-model="newImage" placeholder="Enter Image URL" />
                    <input ng-model="price" placeholder="Enter the Price" />
                    <button type="submit">Add Objects</button>
                </form>
            </div>
            <div class="col-md-12 column" >
                <div class="row">
                    <div class="col-md-4" ng-repeat="obj in happyPenguinObjects">
                        <div class="thumbnail">
                            <img alt="300x200" src="{{obj.Image}}" style="min-height:300px;min-width:300px" />
                            <div class="caption"> 
                                <h3>
                                    Price: {{obj.Price}}
                                </h3>
                                {{ obj.ItemName }}

                                <p>
                                    <button class="btn btn-success" ng-click="addToDb(obj)"></button>
                                </p>
                            </div>
                        </div>
                    </div>
                    <!--<div class="col-md-4">
                        <div class="thumbnail">
                            <img alt="300x200" src="{{obj.Image}}" />
                            <div class="caption">
                                <h3>
                                    Price: {{obj.price}}
                                </h3>
                                {{ obj.ItemName }}

                                <p>
                                    <a class="btn btn-primary" href="#">Action</a> <a class="btn" href="#">Action</a>
                                </p>
                            </div>
                        </div>
                    </div>-->
                    <!--<div class="col-md-4">
                        <div class="thumbnail">
                            <img alt="300x200" src="{{obj.Image}}" />
                            <div class="caption">
                                <h3>
                                    Price: {{obj.price}}
                                </h3>
                                {{ obj.ItemName }}

                                <p>
                                    <a class="btn btn-primary" href="#">Action</a> <a class="btn" href="#">Action</a>
                                </p>
                            </div>
                        </div>
                    </div>-->
                </div>
            </div>
            </div>
            <div class="row clearfix">
           </div>
        </div>
   
</body>
</html>


